<template>
	<div v-bind:class="oneDiv">
		comC-3
		<br>
		<transition name="inout">
			<span v-show="showme">heoo! me! ye!</span>
		</transition>
		<br>
		<button @click="touch">yyyyyyy</button>
	</div>
</template>

<script>
    export default {
        name: "comC3",
        data: function () {
            return {
                oneDiv: 'oneDiv',
                showme: true
            }
        },
        methods: {
            touch: function () {
                this.showme = !this.showme
            }
        }

    }
</script>

<style scoped>
	.oneDiv {
		background-color: #090ffa;
		border-color: red;
		border-width: 10px;
		box-shadow: chartreuse;
		margin-top: 20px;
	}

	.inout-enter-active,.inout-leave-active{
		transition: opacity .5s ease-in-out;
	}
	.inout-enter,.inout-leave-active{
		opacity: 0;
	}

</style>